<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>理财详细页-迅泊达</title>
    <link rel="shortcut icon" href="/static/favicon.ico"/>
    <link rel="stylesheet" href="/static/front/fonts/iconfont.css">
    <link rel="stylesheet" href="/static/front/css/base_new.css">
    <link rel="stylesheet" href="/static/front/css/library.css">
    <link rel="stylesheet" href="/static/front/css/style.css">
    <script src="/static/front/js/jquery-1.11.1.min.js"></script>
    <script src="/static/front/js/jquery.countdown.js"></script>
    <script src="/static/front/js/js.js"></script>
    <!--[if lt IE 9]>
    <script src="/static/front/js/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script type="text/javascript" src="plugIn/PIE.js"></script>
    <![endif]-->
    <style>
    	.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:998;width:100%;height:100%;_padding:0 20px 0 0;background:#f6f4f5;display:none;}
		.showbox{position:fixed;top:0;left:50%;z-index:9999;opacity:0;filter:alpha(opacity=0);margin-left:-80px;}
		*html,*html body{background-image:url(about:blank);background-attachment:fixed;}
		*html .showbox,*html .overlay{position:absolute;top:expression(eval(document.documentElement.scrollTop));}
		#AjaxLoading{border:1px solid #8CBEDA;color:#37a;font-size:12px;font-weight:bold;}
		#AjaxLoading div.loadingWord{width:200px;height:50px;line-height:50px;border:2px solid #D6E7F2;background:#fff;}
		#AjaxLoading img{margin:10px 15px;float:left;display:inline;}
		.cntDigit{margin-top:11px;}
    </style>
</head>
<body style="background: #FCFCFC">
<div class="content">
    <#include "../base/top.ftl" />
    <div id="financialDetailsMain">
        <div class="breadcrumb">
            <p class="cnt">您的当前位置：<a href="/index">网站首页></a><a href="javascript:;">标的详情</a></p>
        </div>
        <div class="cnt clearfix layoutMain">
            <div class="top">
                <div class="investmentItem clearfix">
                    <h2 class="title"><div class="smallTitle">${borrowVo.title!}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <em>
                    ${borrowVo.productName!}，
                    <#list paymentModeAll?keys as key>
                    	<#if borrowVo.paymentMode?string == key>
                    		${paymentModeAll[key]}
                    	</#if>
                    </#list>
                    </em> 
                    	<i>开标日期：<#if borrowVo.timingShow?exists>${borrowVo.timingShow?string("yyyy-MM-dd HH:mm:dd")!}<#else>${borrowVo.createTime?string("yyyy-MM-dd HH:mm:dd")!}</#if></i></div></h2>
                    <div class="left fl">
                        <ul class="money clearfix">
                        <li class="moneyL fl">
		                       <#if borrowVo.dateUtil?? && borrowVo.dateUtil = 'MONTH'>
                                 <p>
                               	  	年收益率：<span>${(borrowVo.percent)?string("0.00")}%</span>
                                 </p>
                               <#elseif borrowVo.dateUtil?? && borrowVo.dateUtil = 'DAY'>
                                 <p>
                               		天收益率：<span>${(borrowVo.percent/360)?string("0.000")}%</span> 
                               	 </p>
                               </#if>
		                        </li>
                            <li class="moneyC fl"><p>投标金额：<span>${borrowVo.amount?string(",##0.00")!}</span>元</p></li>
                            <li class="moneyR fl">
                              <p>投标期限：
                                <span><#if borrowVo.dateUtil?? && borrowVo.dateUtil = 'MONTH'>${borrowVo.deadline}</span>个月
                                <span><#elseif borrowVo.dateUtil?? && borrowVo.dateUtil = 'DAY'>${borrowVo.deadline!}</span>天
                                  </#if>
                               </p>
                             </li>
                        </ul>
                        <div class="schedule clearfix">
                            <div class="scheduleL fl">
                                <span class="fl">投标进度：</span>
                                <div class="progressBarWrap fl">
                                    <div class="progressBar" style="width:${borrowVo.schedules!}%"></div>
                                    <span class="progressData">${borrowVo.schedules!}%</span>
                                </div>
                            </div>
                            <p class="scheduleR fr">可投剩余金额：<span>${borrowVo.notTenderMoney?string(",##0.00")}</span> 元</p>
                        </div>
                        <!--
                        <p class="alert">投标10000元,
                        <#if borrowVo.dateUtil?? && borrowVo.dateUtil == "MONTH">年收益率${(borrowVo.percent)?string("0.00")}%,
                        <#elseif borrowVo.dateUtil?? && borrowVo.dateUtil == "DAY">天收益率${((borrowVo.percent)?string("0.00")?number/360)?string("0.000")}%,
                        </#if>
                                                                        投标期限<span><#if borrowVo.dateUtil?? && borrowVo.dateUtil = 'MONTH'>${borrowVo.deadline}</span>个月
                             <span><#elseif borrowVo.dateUtil?? && borrowVo.dateUtil = 'DAY'>${borrowVo.deadline!}</span>天
                                   </#if>
                        ,<em class="red">可获得利息收益￥<#if borrowVo.dateUtil?? && borrowVo.dateUtil = 'DAY'>${((((((borrowVo.percent)?string("0.00")?number)/360)?string("0.000"))?number)*100)*(borrowVo.deadline)}元
                        <#elseif borrowVo.dateUtil?? && borrowVo.dateUtil = 'MONTH'>${((((borrowVo.percent)?string("0.00")?number)/12)*100)*(borrowVo.deadline)}元
                        </#if></em></p>-->
                        <div class="guaranteeParty">
                           	 <!--担保方： <em>${borrowVo.guaranteeName!}</em>-->
                           	  <i style="margin-left:58px;">借款编号: ${borrowVo.id!}</i>
                           	 <!-- 倒计时插件 -->
                           	 <#if borrowVo.countDown?exists>
								<div class="scheduleR fr clearfix" id="holder${borrowVo.id}" style="margin-right:40px;">
		                            <div class="fl countdownTxt">
		                                <em>投标倒计时：</em>
		                            </div>
		                            <div class="digits fr" style="margin-right:-34px;" id="digits${borrowVo.id}"></div>
		                            <script type="text/javascript">
			                            $(function(){
			                                $("#digits${borrowVo.id}").countdown({
			                                    image: "${_front_images}/countdown_bg.png",
			                                    format: "hh:mm:ss",
			                                    startTime: "${borrowVo.countDown}",
			                                    timerEnd:function(){
			                                    	$("#holder${borrowVo.id}").remove();
			                                    	$("#btn-submit").val("立即投标").css("background","#f06a11").click(tenderBtn);
			                                    }
			                                });
			                            });
			                        </script>
		                        </div>
                           </#if>
                        </div>
                        <ul class="textList clearfix">
                            <li class="one">借款人: <em><#if borrowVo.username?exists>${borrowVo.username[0..2]}**</#if></em></li>
                            <li class="two">总投标数： <em>${borrowVo.sumTenderCount}次</em></li>
                            <li class="three">最大投标额： <i>￥<#if borrowVo??&&borrowVo.max?exists>${borrowVo.max?string(",##0.00")!}<#else>0.00</#if></i></li>
                            <li class="four" style="margin-left:0px;">最小投标额： <em>￥<#if borrowVo??&&borrowVo.min?exists>${borrowVo.min?string(",##0.00")!}<#else>0.00</#if></em></li>
                        </ul>
                    </div>
                    <div class="right fr">
                        <div class="one">
                            <p class="clearfix rechargeBtn"><span class="fl availableAmount">您的可用余额：<em><#if userAccount?exists>${userAccount.balance?string(",##0.00")}<#else>0.00</#if></em> 元</span><a href="/account/recharge" class="fr recharge">充值</a></p>
                            <p class="prompt">最小投标额 ≤ 可投标金额 ≤ 最大投标额\可用余额\剩余可投</p>
                        </div>
                        <div class="two clearfix">
                            <p class="fl residualAmount"><span>￥<em>${borrowVo.notTenderMoney?string(",##0.00")}</em></span>　剩余可投</p>
                            <p class="fr autoMoneyBtn" id="useBalance" style="cursor:pointer;">使用全部余额</p>
                        </div>
                        <form  class="form">
                            <div class="bidAmount clearfix moneyForm">
                                <label for="bidAmount" class="fl">投标金额：</label>
                                <input type="text" id="amount" class="fl" placeholder="${borrowVo.min?string(",##0")!}起投">
                            </div>
                            <!--<div class="password clearfix moneyForm">
                                <label for="password" class="fl">交易密码：</label>
                                <input type="password" id="password" class="fl" placeholder="请输入交易密码">
                            </div>-->
                            <!--<div class="picCode clearfix moneyForm">
                                <label for="picCode" class="fl">　验证码：</label>
                                <input type="text" id="picCode" class="fl" placeholder="请输入图片验证码">
                                <span class="verificationCode fl"><img src="${_front_images}/yanzhengma.jpg" alt=""></span>
                            </div>-->
                            <#if borrowVo.countDown?exists>
                            	<input type="button" class="subBtn" id="btn-submit" value="待发布" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;background:#ccc;">
                            <#else>
	                            <#if borrowVo.status?exists>
	                        		<#if (borrowVo.status=='borrow' || borrowVo.status=='new' )>
	                        			<input type="button" class="subBtn" id="btn-submit" value="立即投标" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;" onclick="tenderBtn();">
	                        		<#elseif borrowVo.status=='check'>
	                        			<input type="button" class="subBtn" id="btn-submit" value="复审中" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;background:#ccc;">
	                    			<#elseif borrowVo.status=='pay'>
	                    				<#if borrowVo.isBuyBack?? && borrowVo.isBuyBack =="Y">
				                    		<input type="button" class="subBtn" id="btn-submit" value="回购中" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;background:#ccc;">
			                    		<#else>
				                    		<input type="button" class="subBtn" id="btn-submit" value="还款中" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;background:#ccc;">
			                    		</#if>
	                    			<#elseif borrowVo.status=='complete'>
	                    				<input type="button" class="subBtn" id="btn-submit" value="已还完" style="font-weight:600;font-size:16px;margin-top:16px;cursor:pointer;background:#ccc;">
	                        		</#if>
	                        	</#if>
	                        </#if>
                        </form>
                        
                        <div class="overlay"></div>

						<div id="AjaxLoading" class="showbox">
						    <div class="loadingWord"><img src="/static/front/images/waiting.gif">投标处理中，请稍候...</div>
						</div>
						
						<div style="height:200px;"></div>
                    </div>
                </div>
            </div>
            <div class="bottom">
                <div class="Tab">
                    <span class="TabOne tableTab active">借入详情</span>
                    <span class="TabTwo tableTab">借款客户资料</span>
                    <span class="TabThree tableTab">资金凭证</span>
                    <span class="TabFour tableTab">贷后回访</span>
                    <span class="TabFive tableTab">投标记录</span>
                    <div class="financialDetailsOne1 financialDetailsOne">
                    	<#if borrowVo?exists>${borrowVo.borrowDetail!}</#if>
                    </div>
                    <div  class="financialDetailsOne2 financialDetailsOne" style="display: none">
                        <div class="personal" id="layer-photos-personalInfo">
                            <p class="title">个人信息 <span class="triangle"></span></p>
                            <#if personalInfo?exists>
                            	<#list personalInfo as model>
                            		<img src="${model.path}" layer-src="${model.path}" style="margin-top:10px;margin-right:10px;display:inline-block;width:250px;height:250px;">
                            	</#list>
                            </#if>
                        </div>
                        <div class="assets" id="layer-photos-capitalInfo">
                            <p class="title">资产信息<span class="triangle"></span></p>
                            <#if capitalInfo?exists>
                            	<#list capitalInfo as model>
                            		<img src="${model.path}" layer-src="${model.path}" style="margin-top:10px;margin-right:10px;display:inline-block;width:250px;height:250px;">
                            	</#list>
                            </#if>
                        </div>
                    </div>
                    <div  class="financialDetailsOne3 financialDetailsOne" style="display: none">
                    	<#if borrowVo?exists>${borrowVo.capitalVoucher!}</#if>
                    </div>
                    <div  class="financialDetailsOne4 financialDetailsOne" style="display: none">
                    	<#if borrowVo?exists>${borrowVo.loanVisit!}</#if>
                    </div>
                    <div  class="financialDetailsOne5 financialDetailsOne" style="display: none">
                        <table class="detailed tabLibrary" width="1200"  border="0" cellspacing="0" cellpadding="0">
                            <tr>
                            	<th class="one">序号</th>
                                <th class="one">投标人</th>
                                <th class="two">投标金额</th>
                                <th class="three">有效金额</th>
                                <th class="four">投标时间</th>
                                <th class="five">终端</th>
                                <th class="five">状态</th>
                            </tr>
                            <#if listTender?exists>
                            	<#list listTender as model>
                            		<tr>
                            			<td class="one">${model_index+1}</td>
		                                <td class="one">
		                                	<#if model.tenderUserName?length gt 1>
		                                		${model.tenderUserName[0..1]}***
		                                	<#else>
		                                		${model.tenderUserName}***
		                                	</#if>
		                                </td>
		                                <td class="two">${model.amount?string(",##0.00")!}元</td>
		                                <td class="three">${model.amount?string(",##0.00")!}元</td>
		                                <td class="four">${model.createTime?string("yyyy-MM-dd HH:mm:ss")!}</td>
		                                <td class="five">
		                                	<#if model.terminal?exists && model.terminal = 'PC'>PC端
		                                	<#elseif model.terminal?exists && model.terminal = 'WX'>微信端
		                                	<#elseif model.terminal?exists && model.terminal = 'APP'>APP端
		                                	</#if>
		                                </td>
		                                <td class="five">全部通过</td>
		                            </tr>
                            	</#list>
                            </#if>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="footer">
        <div class="content">
           <#include "../base/foot.ftl" />
        </div>
    </div>
</div>

<script type="text/javascript" src="${_front_js}/layer/layer.js" ></script>
<script type="text/javascript" src="${_front_js}/layer/extend/layer.ext.js" ></script>
<script type="text/javascript">
layer.ready(function(){ //为了layer.ext.js加载完毕再执行
    layer.photos({
        photos: '#layer-photos-personalInfo'
    });
    layer.photos({
        photos: '#layer-photos-capitalInfo'
    });
});
function tenderBtn(){
    var borrowId = ${borrowVo.id};
    var amount=$.trim($("#amount").val());
    //var password=$.trim($("#password").val());
    <#if _user?exists>
    <#else>
    layer.alert("请先登录！",function(){window.location.href="/login"});
    return;
    </#if>
    if(amount == ""){
        layer.alert("投资金额不能为空！")
        return ;
    }
    if(isNaN(amount)){
        layer.alert("投资金额只能是数字！")
        return ;
    }
    if(amount<100){
       layer.alert("投资金额至少为￥100！")
       return 
    }
   // if(password == ""){
       // layer.alert("密码不能为空！")
      //  return ;
   // }
    
   $.ajax({
        type: "post", 
        dataType: "json", 
        async:false,
        url: "/front/tender/save",
        data: {
            "borrowId":borrowId,
            "amount":amount
            //,"password":password
        }, 
        success: function (result) { 
            if(result.code == -1){
            	var userId="<#if _user?exists>${_user.id}</#if>";
            	tender(borrowId,amount,userId);
            }else{
            	layer.alert(result.msg,function(index){
            		layer.close(index);
            		window.location.reload();
            	});
            }
       	}
       	
   })		

}

function tender(borrowId,amount,userId){
   $.ajax({
        type: "post", 
        dataType: "json", 
        async:false,
        cache: false,//将不会从浏览器缓存中加载请求信息。
        url: "/fuion/transfer/freezen",
        data: {
            "borrowId":borrowId,
            "userId":userId,
            "amount":amount
        }, 
         beforeSend:function(){   
        	//触发ajax请求开始时执行,改变提交按钮上的文字并将按钮设置为不可点击
			$("#btn-submit").attr("disabled",true);
			//稍等后图片出现
		    $(".overlay").css({'display':'block','opacity':'0.8'});
		    $(".showbox").stop(true).animate({'margin-top':'300px','opacity':'1'},200);
        },
        success: function (result) { 
	        setTimeout(function(){
				//稍等后图片消失
				$(".showbox").stop(true).animate({'margin-top':'250px','opacity':'0'},400);
				$(".overlay").css({'display':'none','opacity':'0'});
				//	放开锁定投标按钮
				$("#btn-submit").attr("disabled",false);
	        	if(result.code==-1){
                	layer.alert("操作成功!",function(index){
                		layer.close(index);
                		window.location.reload();
                	});
	        	}else{
	        		layer.alert("操作失败！错误代码:"+result.entity);
	        	}
	        },3000);
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
        	layer.alert("网络繁忙，请稍后再试...");	
            $("#btn-submit").attr("disabled",false);    
			$(".overlay").css({'display':'none','opacity':'0'});  
			$(".showbox").stop(true).animate({'margin-top':'250px','opacity':'0'},400);          
        }   
   });     	
}


$("#useBalance").click(function(){
	var notTenderMoney = <#if borrowVo??>${borrowVo.notTenderMoney!}<#else>0</#if>;
	var balance = <#if userAccount??>${userAccount.balance!}<#else>0</#if>;
	var maxTender = <#if borrowVo??>${borrowVo.max!}<#else>0</#if>;
	var amount = balance >= notTenderMoney?notTenderMoney:balance;
	amount = amount >= maxTender?maxTender:amount;
	amount=Math.floor(amount);
    if(amount%100!==0){
        amount=(Math.floor(amount/100))*100;
     }
	$("#amount").val(amount);
});

</script>
</body>
</html>